<!-- 开发者：王茜
开发时间：7-10
修改时间：
功能：视频列表 -->
<template>
  <div id="InterviewList">
    <el-row>
      <el-col :span="20" :offset="2">
        <div class="div_title">远程面试</div>
        <p v-if="more===false" class="p_infor">暂无视频面试</p>
        <el-row v-else class="interviewList" v-for="(item,index) in interviewList" :key="index">
          <el-col :span="4">
            <span><img src="../../../src/assets/img/home/remoteInterview.png" class="image"></span>
          </el-col>
          <el-col :span="8">
            <el-row class="interviewInfor">
              <el-col :span="24">
                <h3 v-if="isCompany===true">应聘者姓名：{{item.real_name}}</h3>
                <h3 v-else>应聘公司：{{item.company_name}}</h3>
              </el-col>
              <el-col :span="24" class="infor">
                <span><img src="../../../src/assets/img/home/icon_interviewer.png" height="4%" width="4%"></span>
                <span class="time" v-if="isCompany===true">职位名称：{{item.position_name}}</span>
                <span class="time" v-else>应聘职位：{{item.job_title}}</span>
              </el-col>
              <el-col :span="24" class="infor">
                <span><img src="../../../src/assets/img/home/icon_time.png" height="3%" width="3%"></span>
                <span class="time" v-if="isCompany===true">面试时间：{{item.interview_time}}</span>
                <span class="time" v-else>面试时间：{{item.upstring_time}}</span>
              </el-col>
            </el-row>
          </el-col>
          <el-col :span="5">
            <el-row class="addInfor">
              <el-col :span="24" class="infor">
                <span><img src="../../../src/assets/img/home/icon_interviewer.png" height="4%" width="4%"></span>
                <span class="time" v-if="isCompany===true">性别：{{item.sex}}</span>
                <span class="time" v-else>发送时间：{{item.upstring_time}}</span>
              </el-col>
              <el-col :span="24" class="infor">
                <span v-if="isCompany===true"><img src="../../../src/assets/img/home/icon_time.png" height="3%"
                                                   width="3%"></span>
                <span class="time" v-if="isCompany===true">学历：{{item.education}}</span>
                <!-- <span class="time" v-else>面试时间：{{item.upstring_time}}</span> -->
              </el-col>
            </el-row>
          </el-col>
          <el-col :span="7">
            <el-button type="primary" class="button" size="large"
                       @click="goInterview(item.interview_time,item.interview_place)">点击进入
            </el-button>
          </el-col>
        </el-row>

        <el-pagination @current-change="handleCurrentChange" layout="total, prev, pager, next" :total="total"
                       class="page-no-style"></el-pagination>
      </el-col>
    </el-row>
  </div>
</template>
<script>
  import { postDataToServer } from '../../../src/assets/js/post.js'
  import { commonNotify, formatterTime } from '../../../src/assets/js/common.js'
  import { getStaticMapList } from '../../../src/assets/js/GlobeDefine.js'

  export default {
    name: 'InterviewList',
    data () {
      return {
        sysId: '0',
        currentdate: '',
        interviewList: [],
        endTime: '',
        page_no: 1,
        startTime: '',
        total: 0,
        url: '',
        type: '',
        interview_time: '',
        time: '',
        isCompany: 'false',
        more: 'true',
        NRENGUum: ''
      }
    },
    methods: {
      handleCurrentChange (pageNum) {
        this.page_no = pageNum
      },
      getInterviewList (Num, pageNum) {
        let _this = this
        let params = new Object()
        params.page_no = _this.page_no
        params.page_size = 20
        params.interview_type = 1
        postDataToServer(Num, params).then((data) => {
          if (data.status === 0) {
            _this.interviewList = data.data_list
            _this.total = data.data_list.length
            if (_this.total === 0) {
              _this.more = false
            } else {
              for (let i = 0; i < data.data_list.length; i++) {
                _this.interviewList[i].education = getStaticMapList('education', _this.interviewList[i].education)
                _this.interviewList[i].sex = getStaticMapList('sex', _this.interviewList[i].sex)
              }
            }
          }
        }).catch(function (err) {
          _this.$message({
            message: err,
            type: 'error'
          })
        })
      },
      getNowFormatDate () {
        var _this = this
        let date = new Date()
        let seperator1 = '-'
        let seperator2 = ':'
        let month = date.getMonth() + 1
        let strDate = date.getDate()
        let str
        if (month >= 1 && month <= 9) {
          month = '0' + month
        }
        if (strDate >= 0 && strDate <= 9) {
          strDate = '0' + strDate
        }
        str = date.getFullYear() + seperator1 + month + seperator1 + strDate + ' ' + date.getHours() + seperator2 + date.getMinutes() + seperator2 + date.getSeconds()
        return str
      },
      goInterview (viewTime, url) {
        var _this = this
        _this.nowTime = _this.getNowFormatDate()
        var viewTimes = new Date(viewTime)
        var nowTime = new Date(_this.nowTime)
        let s = nowTime - viewTimes
        if (s < 0) {
          _this.$message({
            message: '还未到面试时间',
            type: 'warning'
          })

        } else if (s > 3600000) {
          _this.$message({
            message: '已超过面试时间',
            type: 'warning'
          })
        } else {
          window.open(url)
        }
      }
    },
    created () {
      //  if(_this.total === 0){
      // 	_this.more = flase;
      // }
      this.type = this.$store.state.talentExchange
      if (this.type === '企业用户') {
        this.isCompany = true
        this.getInterviewList('HM_COMPANY_INTERVIEW_VIEW', 1)
      } else if (this.type === '个人用户') {
        this.isCompany = false
        this.getInterviewList('HM_PERSONAL_INTERVIEW_VIEW', 1)
      }
    }
  }
</script>
<style scoped>
  .image {
    margin-top: 0.5em;
    margin-left: 2em;
    width: 60%;
  }

  .infor {
    margin-top: 0.5em;
  }

  .addInfor {
    margin-top: 2.5em;
  }

  .interviewInfor {
    margin: 1em 1em;
  }

  .interviewInfor h3 {
    color: #324057;
  }

  .button {
    width: 12em;
    margin-top: 4em;
    margin-right: 4em;
  }

  .interviewList {
    border: 1px solid #ccc;
    padding: 1em 1em;
    margin-top: 2em;
  }

  .div_title {
    margin-bottom: 2em;
  }

  #InterviewList {
    padding: 20px;
  }

  .p_infor {
    text-align: center;
  }
</style>
